<template>
  <div class="home">
    <Head></Head>
    <van-swipe class="my-swipe" :autoplay="2000" indicator-color="white">
      <van-swipe-item
        v-for="item in swipe_list"
        :key="item.id"
        style="height: 100%; line-height: 0"
      >
        <a :href="item.url">
          <img :src="item.pic" alt="加载中..." style="width: 100%; height: 3.5rem" />
        </a>
      </van-swipe-item>
    </van-swipe>
    <!-- ------------------------->
    <div class="main-box">
      <div class="car-box">
        <div v-for="(item, index) in middle_list" :key="index">
          <img :src="item.pic" :alt="item.note" />
          <p>{{ item.note }}</p>
        </div>
      </div>
      <van-button plain type="primary" size="large" @click="startCarrent"
        >开始租车</van-button
      >
      <div class="box-bouttom">
        <div>
          <h3>公司介绍</h3>
          <p>
            河南省小朋友汽车服务有限公司是河南省内早期经上级主管部门批准并登记注册的汽车租赁公司，
            河南省道路运输协会汽车租赁工作委员会理事长单位，注册资金一千零一万元整（工商在线查询）。
            以社会各界需要用车的个人、企事业单位为服务对象，提供包括婚庆租车，旅游租车，商务租车，
            会议租车等各种类型的汽车租赁服务，是一家专业汽车租赁服务公司。
          </p>
        </div>
        <div>
          <div>
            <h4>联系我们</h4>
            <p>公司地址：黄河路76号附16号合立大厦东配楼二楼</p>
            <p>联系电话：1597886541</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Head from "../components/Home/Head";
import { carousel, middleImg } from "../request/home/home_http";
export default {
  props: {},
  data() {
    return {
      swipe_list: null,
      middle_list: null,
      advertise:{},
      idCard:this.$store.state.user.idCard,
      licenseNo:this.$store.state.user.licenseNo,
      name:this.$store.state.user.name,
      email:this.$store.state.user.email,
    };
  },
  methods: {
    startCarrent(){
      console.log(this.$store.state.user.idCard);
      console.log(this.$store.state.user.licenseNo);
      console.log(this.$store.state.user.name);
      console.log(this.$store.state.user.email);
      if ( this.$store.state.user.idCard==null || this.$store.state.user.idCard=='' || this.$store.state.user.licenseNo==null || this.$store.state.user.licenseNo=='' || this.$store.state.user.name==null || this.$store.state.user.name=='' || this.$store.state.user.email==null || this.$store.state.user.email==''){
          alert("请完善个人信息");
         this.$router.push('/userdata');
      }else{
        this.$router.push('/home');
      }

    }
  },
  mounted() {
    // 顶部轮播广告请求
    carousel({ positionId: 1, status: 1, }).then((res) => {
      this.swipe_list = res.data;
    }); 
    // 中部广告请求
    middleImg({
      positionId: 2,
      status: 1,
    }).then((res) => {
      this.middle_list = res.data;
    });

    //
  },
  components: {
    Head,
  },
};
</script>

<style scoped lang="less">
* {
  box-sizing: border-box;
}
.home {
  height: 100%;
  font-size: 0.28rem;
  .my-swipe .van-swipe-item {
    //轮播
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }

  .main-box {
    .title {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 0.3rem 0;
      > h3 {
        font-size: 0.32rem;
        color: #666;
        margin-bottom: 0.05rem;
      }
      > p {
        font-size: 0.12rem;
        color: var(--groot-ui-color-gray-7);
      }
    }
    .car-box {
      width: 100%;
      display: flex;
      justify-content: space-around;
      text-align: center;
      div {
        // border: 1px solid;
        width: 30%;
        display: inline-block;
        background-color: rgb(248, 248, 248);
        img {
          display: inline-block;
          width: 100%;
          height: 2rem;
          padding: 0.1rem;
        }
        p {
          color: #555;
          font-size: 0.12rem;
          padding: 0.05rem;
        }
      }
    }
    button {
      // color: #555;
      letter-spacing: 0.02rem;
      font-size: 0.26rem;
      width: 60%;
      margin: 0.3rem 0;
      border: 1px solid #ccc;
      margin-left: 1.5rem;
      height: 0.65rem;
    }
    .box-bouttom {
      > div {
        display: inline-block;
      }
      > div:nth-of-type(1) {
        width: 100%;
        padding: 0.2rem;
        background-color: rgb(248, 248, 248);
        h3 {
          margin-bottom: 0.1rem;
        }
        p {
          color: #666;
          font-size: 0.16rem;
        }
      }
      > div:nth-of-type(2) {
        width: 100%;
        height: 2.2rem;
        margin-top: 0.2rem;
        display: flex;
        justify-content: center;
        background: url("https://jianzhan-image.cdn.bcebos.com/jimuyu/pcSite/tplImage/联系我们-图片.png@f_webp,q_90")
          no-repeat;
        background-size: 100% 100%;
        position: relative;
        > div {
          color: #eee;
          width: 80%;
          // border: 1px solid;
          position: absolute;
          top: 20%;
          p {
            font-size: 0.16rem;
            margin: 0.1rem 0;
          }
        }
      }
    }
  }
}
</style>
